import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image
} from 'react-native';

/***
 * state的详解
 */

export default class RefComponent extends Component {
	//组件的state是私有的，使用方式1
	state = {
		size:12,
	}
	//构造函数
	constructor(props) {
		super(props);
		//方式2
		/* this.state = {
			size:80,
			count: 0
		} */
	}

  getSize(){
    return this.state.size;
  }

  render() {
    return (
      <View>
        <Text 
        	style={{ fontSize: 20, backgroundColor: '#3e2723' }}
        	onPress={
        		()=>{
        			this.setState({
        				size:this.state.size+10,
        			})
        		}
        	}

        >吹吹吹...</Text>
		<Text 
        	style={{ fontSize: 20, backgroundColor: '#3e2723' }}
        	onPress={
        		()=>{
        			this.setState({
        				size:this.state.size-10,
        			})
        		}
        	}

        >放放放...</Text>
        <Image
        	style={{ width: this.state.size, height: this.state.size }}
        	source={require('./balloon.jpg')}
        />
        
      </View>
    )
  }
}